<h1><i class="fontello-icon-users"></i> Control de Usuarios</h1>

<!-- Formulario para agregar usuario. -->
<form id="frmRegistroUsuario" action="code/api/c_usuarios.php" class="form hidden">

	<input type="hidden" name="op" value="agregar"/>

	<fieldset>
		<legend>Agregar Usuario</legend>

		<div>
			<label>Nombre de Usuario:</label>
			<input type="text" name="usuario"/>
		</div>

		<div>
			<label>Contraseña:</label>
			<input type="password" name="password"/>
		</div>

		<div>
			<label>Tipo de Usuario:</label>
			<select name="tipo">
				<option value="1">Usuario Administrador</option>
				<option value="2">Usuario Regular</option>
			</select>
		</div>

		<div class="message error"></div>

		<div class="buttons">
			<input type="submit" value="Guardar"/>
			<button onclick="Usuarios.cancelarRegistroUsuario(); return false;">Cancelar</button>
		</div>
	</fieldset>    

</form>

<!-- Formulario para editar usuario. -->
<form id="frmEditarUsuario" action="code/api/c_usuarios.php" class="form hidden">

	<input type="hidden" name="op" value="actualizar" />
	<input type="hidden" name="id" />

	<fieldset>
		<legend>Editar Usuario</legend>

		<div>
			<label>Nombre de Usuario:</label>
			<input type="text" name="usuario"/>
		</div>

		<div>
			<label>Contraseña:</label>
			<input type="password" name="password"/>
		</div>

		<div>
			<label>Tipo de Usuario:</label>
			<select name="tipo">
				<option value="1">Usuario Administrador</option>
				<option value="2">Usuario Regular</option>
			</select>
		</div>

		<div class="message error"></div>

		<div class="buttons">
			<input type="submit" value="Guardar"/>
			<input onclick="Usuarios.cancelarEditarUsuario(); return false;" type="button" value="Cancelar"/>
		</div>
	</fieldset>
</form>

<div class="control-buttons">
	<button onclick="Usuarios.pagAnterior()"><i class="fontello-icon-left-circle"></i></button>

	<span data-content="html" data-model="Usuarios.modeloLocal" data-observe="pagina, paginas">
		<em>Página:</em> [[pagina]] / [[paginas]]
	</span>

	<button onclick="Usuarios.pagSiguiente()"><i class="fontello-icon-right-circle"></i></button>

	<select data-model="Usuarios.modeloLocal" data-property="count">
		<option value="1">1</option>
		<option value="5">5</option>
		<option value="10">10</option>
		<option value="20">20</option>
		<option value="30">30</option>
		<option value="40">40</option>
		<option value="50">50</option>
		<option value="100">100</option>
	</select>

	<button onclick="Usuarios.cargarLista()"><i class="fontello-icon-ccw"></i></button>
	<button onclick="Usuarios.expandirRegistroUsuario()"><i class="fontello-icon-plus-circle"></i> Agregar Usuario</button>

	<button class="float-right" onclick="Usuarios.exportar(true);"><i class="fontello-icon-table"></i> Exportar Todo</button>
	<button class="float-right" onclick="Usuarios.exportar(false);"><i class="fontello-icon-eye"></i> Exportar Visible</button>
</div>

<!-- Listado de usuarios. -->
<div class="table" data-content="html" data-model="Usuarios.modeloLocal" data-observe="lista">
	[[#if lista_vacia]]

		<div class="header">
			<span class="no-data">No hay usuarios que mostrar.</span>
		</div>

	[[:else]]

		<div class="header">
			<span>Código de Usuario</span>
			<span>Tipo de Usuario</span>
			<span>Nombre de Usuario</span>
			<span style="width: 170px;"></span>
		</div>

		[[#each lista]]
		<div>
			<span>[[id]]</span>
			<span>[[#switch tipo]][[:case 1]]Administrador[[:case 2]]Usuario Regular[[/switch]]</span>
			<span>[[usuario]]</span>
			<span class="buttons">
				<button onclick="Usuarios.borrarUsuario('[[id]]');"><i class="fontello-icon-trash-2"></i> Eliminar</button>
				<button onclick="Usuarios.editarUsuario('[[id]]');"><i class="fontello-icon-edit"></i> Editar</button>
			</span>
		</div>
		[[/each]]

	[[/if]]
</div>
